﻿@using OrchardCore.ContentFields.Settings
@model OrchardCore.ContentFields.ViewModels.EditTextFieldViewModel

@{
  var settings = Model.PartFieldDefinition.GetSettings<TextFieldSettings>();
}

<div class="form-group">
  <label asp-for="Text">@Model.PartFieldDefinition.DisplayName()</label>
  <textarea asp-for="Text" rows="5" class="form-control"></textarea>
  @if (!String.IsNullOrEmpty(settings.Hint))
  {
    <span class="hint">@settings.Hint</span>
  }
</div>
<style asp-name="codemirror"></style>
<script asp-name="codemirror" depends-on="admin" at="Foot"></script>
<script asp-name="codemirror-mode-javascript" at="Foot"></script>
<script asp-name="codemirror-addon-display-autorefresh" at="Foot"></script>
<script asp-name="codemirror-addon-mode-simple" at="Foot"></script>
<script asp-name="codemirror-addon-mode-multiplex" at="Foot"></script>
<script asp-name="codemirror-mode-xml" at="Foot"></script>
<script asp-src="~/OrchardCore.Liquid/codemirror/liquid.js" at="Foot"></script>
<script at="Foot">
    $(function () {
        var optionsTextArea = document.getElementById('@Html.IdFor(x => x.Text)');
        if (optionsTextArea) {
            var editor = CodeMirror.fromTextArea(optionsTextArea, {
                autoRefresh: true,
                lineNumbers: true,
                styleActiveLine: true,
                matchBrackets: true,
              mode: { name: "liquid" }
            });
            editor.on('change', function (cm) {
              document.getElementById('@Html.IdFor(x => x.Text)').value = cm.getValue();
              $(document).trigger('contentpreview:render');
            });
        }
    });
</script>



